<template>
  <div class="source-deploy-wrapper">
    <div class="source-deploy-wrapper-left">
      <SourceSelect
        ref="sourceSelect"
        :mainRow="mainRow"
        @ok="selectRow"
        @removeModel="initModel"
      ></SourceSelect>
      <SourceExecute
        ref="sourceExecute"
        :selectModelRow="modelRow"
        :mainRow="mainRow"
        @executeOk="reloadRecords"
        @changeStatus="statusChange"
      ></SourceExecute>
    </div>
    <div class="source-deploy-wrapper-right">
      <ExecuteRecords ref="executeRecords" :mainRow="mainRow"></ExecuteRecords>
    </div>
  </div>
  <!-- <div class="app-container">
    <div class="card_body">
      <el-row :gutter="10"
              style="width:33%">
        <el-col :span="24"
                style="height:200px">
          <SourceSelect ref="sourceSelect"
                        :mainRow="mainRow"
                        @ok="selectRow"
                        @removeModel="initModel"></SourceSelect>
        </el-col>
        <el-col :span="24"
                style="height:600px">
          <SourceExecute ref="sourceExecute"
                         :selectModelRow="modelRow"
                         :mainRow="mainRow"
                         @executeOk="reloadRecords"
                         @changeStatus="statusChange"></SourceExecute>
        </el-col>
      </el-row>
      <el-col :span="16"
              style="margin-left:5px;height: 800px;">
        <ExecuteRecords ref="executeRecords"
                        :mainRow="mainRow"></ExecuteRecords>
      </el-col>
    </div>
  </div> -->
</template>

<script>
import SourceSelect from "./source-select.vue";
import SourceExecute from "./source-execute.vue";
import ExecuteRecords from "./execute-records.vue";
import { getRulesBySoftwareIdAndVer } from "@/api/resource/modelSoftware.js";
import Fakeprogress from "@/utils/fakeProgress.js";
export default {
  name: "DeploySoftware",
  components: { SourceSelect, SourceExecute, ExecuteRecords },
  data() {
    return {
      mainRow: {
        skId: void 0,
        skIp: void 0,
        skName: void 0,
        skType: void 0,
        isOnline: void 0,
        ws: void 0,
        os: void 0,
        rjlx: 0,
      },
      modelRow: {
        historySoftwareFile: null,
        historyVarScriptFile: null,
        historySoftwareInsFile: null,
        historyRunScriptFile: null,
        sourceCheck: false,
      },
    };
  },
  watch: {
    "$route.query.p": {
      handler(val) {
        if (val) {
          const param = JSON.parse(Buffer.from(val, "base64").toString());
          this.mainRow.skId = param.skId;
          this.mainRow.skIp = param.skIp;
          this.mainRow.skName = decodeURI(param.skName);
          this.mainRow.skType = param.skType;
          this.mainRow.isOnline = param.isOnline;
          this.mainRow.os = param.os;
          this.mainRow.ws = param.ws;
          // 增加软件类型数据
          this.mainRow.rjlx = param.rjlx;
        }
      },
      immediate: true,
    },
  },
  created() {
    // this.mainRow = this.$route.params.row
  },
  activated() {
    console.log("软件部署显示");
    // 从列表调过来的 并且部署完成的情况下 需要重置数据
    if (
      this.$store.state.permission.jumpFlag &&
      !this.$store.state.permission.deployFlag
    ) {
      Object.assign(
        this.$refs.sourceSelect.$data,
        this.$refs.sourceSelect.$options.data()
      );
      this.$refs.sourceExecute.pathForm.uploadPath = "";
      this.$refs.sourceExecute.pathDisabled = false;
      this.$refs.sourceExecute.fake1 = new Fakeprogress({
        timeConstant: 10000,
      });
      this.$refs.sourceExecute.fake2 = new Fakeprogress({
        timeConstant: 10000,
      });
      this.$refs.sourceExecute.fake3 = new Fakeprogress({
        timeConstant: 10000,
      });
      this.$refs.sourceExecute.fake4 = new Fakeprogress({
        timeConstant: 10000,
      });
      this.$refs.sourceExecute.fake5 = new Fakeprogress({
        timeConstant: 10000,
      });
      this.$refs.sourceExecute.stepInfo = {
        stepText1: "",
        stepText2: "",
        stepText3: "",
        stepText4: "",
        stepText5: "",
        stepStatus1: "wait",
        stepStatus2: "wait",
        stepStatus3: "wait",
        stepStatus4: "wait",
        stepStatus5: "wait",
        stepStatus7: "wait",
      };
      this.$refs.sourceExecute.step1LoadingIcon = "";
      this.$refs.sourceExecute.step2LoadingIcon = "";
      this.$refs.sourceExecute.step3LoadingIcon = "";
      this.$refs.sourceExecute.step4LoadingIcon = "";
      this.$refs.sourceExecute.step5LoadingIcon = "";
      this.$refs.sourceExecute.step = 0;
      this.$refs.sourceExecute.loadingTimmer = void 0;
      this.$refs.sourceExecute.successTimmer = void 0;
      this.$refs.sourceExecute.step1PercentStatus = "";
      this.$refs.sourceExecute.step2PercentStatus = "";
      this.$refs.sourceExecute.step3PercentStatus = "";
      this.$refs.sourceExecute.step4PercentStatus = "";
      this.$refs.sourceExecute.step5PercentStatus = "";
      this.$refs.sourceExecute.percent1show = false;
      this.$refs.sourceExecute.percent2show = false;
      this.$refs.sourceExecute.percent3show = false;
      this.$refs.sourceExecute.percent4show = false;
      this.$refs.sourceExecute.percent5show = false;
      this.$refs.sourceExecute.modelVisible = false;
      this.modelRow = {
        historySoftwareFile: null,
        historyVarScriptFile: null,
        historySoftwareInsFile: null,
        historyRunScriptFile: null,
        sourceCheck: false,
      };
    }
    // 重置数据
    this.$store.commit("SET_JUMP_FLAG", false);
  },
  methods: {
    statusChange(val) {
      this.$refs.executeRecords.onlineStatus = val == "1" ? "在线" : "离线";
    },
    selectRow(row) {
      getRulesBySoftwareIdAndVer({
        softwareId: row.softwareId,
        ver: row.softwareVersion,
      }).then((res) => {
        let checkList = [];
        checkList = res.data;
        if (checkList.length > 0) {
          this.modelRow = Object.assign(row, { sourceCheck: true });
        } else {
          this.modelRow = Object.assign(row, { sourceCheck: false });
        }
        console.log("==============>软件资源规则：" + JSON.stringify(res.data));
      });
    },

    initModel() {
      this.modelRow = {
        historySoftwareFile: null,
        historyVarScriptFile: null,
        historySoftwareInsFile: null,
        historyRunScriptFile: null,
        sourceCheck: false,
      };
    },
    // 刷新执行记录
    reloadRecords() {
      this.$refs.executeRecords.queryHistoryList();
    },
  },
};
</script>

<style lang="scss" scoped>
.card_body {
  display: flex;
}
// .el-row {
//   height: 100%;
// }
.source-deploy-wrapper {
  width: 100%;
  height: calc(100vh - 84px);
  display: flex;
  padding: 20px;
  box-sizing: border-box;
  .source-deploy-wrapper-left {
    width: 540px;
    margin-right: 16px;
    display: flex;
    flex-direction: column;
  }
  .source-deploy-wrapper-right {
    flex: 1;
    overflow: hidden;
  }
}
</style>
